<!DOCTYPE html>
<html>
  <head>
    <title>JavaScript &amp; jQuery - Chapter 11: Content Panels -  Accordion</title>
    <link rel="stylesheet" href="css/base.css" />
    <link rel="stylesheet" href="css/accordion.css" />
  </head>

  <body>

    <header><h1>Monsieur Pigeon</h1></header>

    <section class="page">
      <ul class="accordion">
        <li>
          <button class="accordion-control">Classics</button>
          <div class="accordion-panel">
            <p>If you like your flavors traditional, Monsieur Pigeon's classic marshmallows won't disappoint. With luxuriously <strong>Velvety Vanilla</strong>, <strong>Charming Chocolate</strong>, and <strong>Sumptuous Strawberry</strong>, the favorites you love are treated with the respect and dignity they deserve!</p>
          </div>
        </li>
        <li>
          <button class="accordion-control">The Flower Series</button>
          <div class="accordion-panel">
            <p>Take your tastebuds for a gentle stroll through an English garden filled with Monsieur Pigeon's beautifully fragrant Flower Series marshmallows. With three sweetly floral options: <strong>Elderberry</strong>, <strong>Rose Petal</strong>, and <strong>Chrysanthemum</strong> - all edible and all naturally flavored - they will have you dreaming of butterflies and birdsong in no time.</p>
          </div>
        </li>
        <li>
          <button class="accordion-control">Salt o' The Sea</button>
          <div class="accordion-panel">
            <p>Ahoy! If you long for a taste of organic sea salt mixed in with your sweet Monsieur Pigeon marshmallows, look no further than our Salt o' the Sea range. Featuring two delicious flavors: <strong>Salted Caramel</strong> and <strong>Cashew Butter</strong>, this sweetly salty duo will expand your taste horizons.</p>
          </div>
        </li>
      </ul>
    </section>


    <script src="js/jquery-1.11.0.min.js"></script>
    <script src="js/accordion.js"></script>

  </body>
</html>